<template>

		<view class="list-box "> 
			<view class="f-side">
				<view class="list-common">
						<view class="title">{{item.CarPlate}}</view>
						<view>专属顾问：{{item.SaleMan}}</view>
						<view>车型：{{item.CarModel}}</view>
						<view>进场时间：{{item.EntryDate}}</view>
					</view>
					<view class="btn f-center">
						<button class="common-btn" type="primary" @tap="do_meeting(item)" v-if="item.State=='进场'">接待</button>
						<image src="../../static/home/serviced-2019-11-1.png" mode="" v-if="item.State!='进场'"></image>
					</view>
			</view>
			<view class="list-bottom f-side" v-if="item.item">
				<view class="flex list-bottom-left">
					<block v-for="(item2,index2) in item.item" :key="index2" >
						<view :style="{border:'1rpx solid #'+item2.Color,color:'#'+item2.Color}" class="zcOverflow3" @tap="do_showDetail(item2)">{{item2.Name}}</view>
					</block>
				</view>
				<view class="flex ">
				</view>
			</view>
		</view>

</template>

<script>
	let _this;
	export default{
		data(){
			return{
			}
		},
		props:{
			item:Object
		},
		methods:{
			do_meeting(item){
				this.$emit("do_meeting",item)
			},
			do_showDetail(item){
				this.$emit("do_showDetail",item)
			}
		}
	}
</script>

<style scoped>
	.btn image{
		height: 120upx;
		width: 120upx;
	}
	.list-box{
		padding-top: 20upx !important;
		/* padding-bottom: 0 !important; */
	}
	.list-bottom{
		margin-top: 0;
		position: relative;
		top:20upx;
		margin-top: 0;
	}
		.list-bottom-left>view{
		padding: 3upx 10upx 4upx 15upx;
		height: 40upx;
		line-height: 38upx;
		margin-right: 20upx;
		color: #fff;
		border-radius: 10upx;
		max-width: 180upx !important;
		box-sizing: border-box;
		font-size: 21upx;
	}
</style>
